<template>
    <wd-notice-bar v-if="userProfile.agent?.status == 'refuse'" background-color="#FFEEF1" color="#F22447" :text="reason" />
    <view class="wai">
        <view class="box-name">
            <view class="">姓名</view>
            <input v-model="parameter.name" class="input2" placeholder="请输入姓名" type="text" />
        </view>
        <view class="box-name">
            <view class="">身份证号</view>
            <input v-model="parameter.cardno" class="input" placeholder="请输入身份证号" type="text" />
        </view>
        <view class="box-name">
            <view class="">联系电话</view>
            <input v-model="parameter.mobile" class="input" placeholder="请输入联系电话" type="text" />
        </view>
        <view class="box-name">
            <view class="">收款姓名</view>
            <input v-model="realName" class="input" placeholder="请输入收款真实姓名" type="text" />
        </view>
        <view class="box-name">
            <view class="">收款银行</view>
            <input v-model="bankName" class="input" placeholder="请输入银行姓名" type="text" />
        </view>
        <view class="box-name">
            <view class="">银行账号</view>
            <input v-model="bank" class="input" placeholder="请输入银行账号" type="text" />
        </view>
        <view class="Upload">上传证件</view>
        <view v-if="fullurls.length <= 0" class="flex" @click="addsImg">
            <image class="license" src="@/static/scimg.png" mode=""></image>
        </view>
        <view v-else class="flex" @click="addsImg">
            <image v-for="(it, index) in fullurls" :key="index" class="license" :src="it" mode=""></image>
        </view>
        <!-- 按钮 -->
        <view class="btn" @click="getBtn">提交</view>
    </view>
</template>

<script setup>
import { onLoad, onShow } from '@dcloudio/uni-app';
import { accountSave, agent, user } from '@/api/index.js';
import { uploadFiles } from '@/utils/request.js';
import { utils } from '@/utils/utils.js';
import { ref, computed } from 'vue';
const realName = ref(null); //收款真实姓名
const bankName = ref(null); //银行姓名
const bank = ref(null); //银行账号
const fullurls = ref([]); //证件显示的路径
const userProfile = ref({}); //存储用户信息
// 提交商务参数
const parameter = ref({
    name: null, //姓名
    cardno: null, //证件号
    mobile: null, //手机号
    images: [] //身份证
});
onShow(() => {
    userInfo();
});
// 获取用户信息
const userInfo = async () => {
    const ret = await user();
    if (ret.code == 1) {
        userProfile.value = ret.data;
        console.log('个人信息', userProfile.value);
    } else {
        utils('数据加载失败！');
    }
};
// 店铺审核失败显示失败信息
const reason = computed(() => {
    if (userProfile.value.agent.status == 'refuse') {
        return '审核失败：' + userProfile.value.agent.reason;
    }
});
// 上传详情图
const addsImg = async () => {
    const ret = await uploadFiles();
    fullurls.value = ret.map((item) => item.fullurl); //显示的图片路径
    parameter.value.images = ret.map((item) => item.url); //参数的图片路径
    console.log(111, ret);
};
// 点击提交提交资料
const getBtn = async () => {
    const errorMsg = check(parameter.value);
    // 提交前判断一下提交的信息
    if (errorMsg) {
        return utils(errorMsg);
    }
    editsave(); //提交信息
};
// 保存银行信息
const editsave = async () => {
    const parms = ref({
        type: 'bank',
        account_name: realName.value,
        account_header: bankName.value,
        account_no: bank.value
    });
    const ret = await accountSave(parms.value);
    if (ret.code == 1) {
        realShop(); //店铺资料
    } else {
        utils(ret.msg);
    }
};
// 提交店铺资料
const realShop = async () => {
    const ret = await agent(parameter.value);
    console.log(ret);
    if (ret.code == 1) {
        uni.redirectTo({
            url: '/pages/sub/submit'
        });
    } else {
        utils(ret.msg);
    }
};
// 提交店铺认证前校验
const check = (param) => {
    if (param.name == null || param.name == '') {
        return '请输入姓名';
    } else if (param.cardno == null || param.cardno.length != 18) {
        return '请输入正确的身份证号';
    } else if (param.mobile == null || param.mobile.length != 11) {
        return '请输入正确的手机号';
    } else if (realName.value == null || realName.value == '') {
        return '请输入收款真实姓名';
    } else if (bankName.value == null || bankName.value == '') {
        return '请输入银行姓名';
    } else if (bank.value == null || bank.value.length < 16) {
        return '请输入正确的银行卡号';
    }
    return null; // 如果所有检查都通过，返回null表示无错误
};
</script>

<style lang="scss" scoped>
.wai {
    .license {
        width: 159rpx;
        height: 159rpx;
    }
    .btn {
        // position: fixed;
        // bottom: 20rpx;
        background-color: #f8bf5a;
        width: 670rpx;
        height: 100rpx;
        text-align: center;
        line-height: 100rpx;
        color: #fff;
        border-radius: 15rpx;
        margin-top: 100rpx;
    }
    .Upload {
        margin: 50rpx 0 38rpx 0;
    }
    .box-name {
        .input2 {
            flex: 1;
            margin-left: 142rpx;
			height: 100%;
        }
        .input {
            flex: 1;
            margin-left: 76rpx;
			height: 100%;
        }
        height: 126rpx;
        border-bottom: 2rpx solid #f7f7f7;
        display: flex;
        align-items: center;
    }
    padding: 0 40rpx;
    padding-bottom: 50rpx;
}
</style>
